<template>
  <div class="adminBackground">
    <!--  侧边栏  -->
    <div class="admin-center">
      <div class="admin-left">
        <el-menu
            style="height: 100%;"
            default-active="1-1"
            class="el-menu-vertical-demo"
            @open="handleOpen"
            @close="handleClose"
            background-color="#fff"
            text-color="#303133"
            active-text-color="#409EFF">
          <el-submenu index="1">
            <template slot="title">
              <i class="el-icon-user"></i>
              <span>用户管理</span>
            </template>
            <el-menu-item index="1-1" @click="toAdminManage">管理员</el-menu-item>
            <el-menu-item index="1-2" @click="toUserManage">用户</el-menu-item>
          </el-submenu>
          <el-submenu index="2">
            <template slot="title">
              <i class="el-icon-bell"></i>
              <span>公告管理</span>
            </template>
            <el-menu-item index="2-1" @click="toReleaseNotice">发布公告</el-menu-item>
            <el-menu-item index="2-2" @click="toNoticeReleased">已发布</el-menu-item>
          </el-submenu>
          <el-submenu index="3">
            <template slot="title">
              <i class="el-icon-coordinate"></i>
              <span>活动管理</span>
            </template>
            <el-menu-item index="3-1" @click="toReleaseActivity">活动发布</el-menu-item>
            <el-menu-item index="3-2" @click="toActivityReleased">已发布</el-menu-item>
          </el-submenu>
          <el-submenu index="4">
            <template slot="title">
              <i class="el-icon-cpu"></i>
              <span>招标管理</span>
            </template>
            <el-menu-item index="4-1" @click="toReleaseBidding">招标发布</el-menu-item>
            <el-menu-item index="4-2" @click="toBiddingReleased">已发布</el-menu-item>
          </el-submenu>
          <el-submenu index="5">
            <template slot="title">
              <i class="el-icon-truck"></i>
              <span>车辆管理</span>
            </template>
            <el-menu-item index="5-1" @click="toPendingVehicle">未处理车辆</el-menu-item>
            <el-menu-item index="5-2" @click="toProcessedVehicle">已处理车辆</el-menu-item>
          </el-submenu>
          <el-submenu index="6">
            <template slot="title">
              <i class="el-icon-document"></i>
              <span>反馈管理</span>
            </template>
            <el-menu-item index="6-1" @click="toPendingFeedback">未处理反馈</el-menu-item>
            <el-menu-item index="6-2" @click="toProcessedFeedback">已处理反馈</el-menu-item>
          </el-submenu>

        </el-menu>
      </div>
      <div class="admin-right">
        <router-view />
      </div>
    </div>

  </div>
</template>

<script>
export default {
  name: "index",
  data() {
    return {

    }
  },
  methods: {
    handleOpen(key, keyPath) {
      // console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      // console.log(key, keyPath);
    },
    toAdminManage(){
      this.$router.push({path:'/adminLayout/adminBackground/adminManage'})
    },
    toUserManage(){
      this.$router.push({path:'/adminLayout/adminBackground/userManage'})
    },
    toReleaseNotice() {
      this.$router.push({path:'/adminLayout/adminBackground/releaseNotice'})
    },
    toNoticeReleased(){
      this.$router.push({path:'/adminLayout/adminBackground/noticeReleased'})
    },
    toReleaseActivity(){
      this.$router.push({path:'/adminLayout/adminBackground/releaseActivity'})
    },
    toActivityReleased() {
      this.$router.push({path:'/adminLayout/adminBackground/activityReleased'})
    },
    toReleaseBidding() {
      this.$router.push({path:'/adminLayout/adminBackground/tenderBidding'})
    },
    toBiddingReleased() {
      this.$router.push({path:'/adminLayout/adminBackground/tenderReleased'})
    },
    toPendingVehicle() {
      this.$router.push({path:'/adminLayout/adminBackground/pendingVehicle'})
    },
    toProcessedVehicle () {
      this.$router.push({path:'/adminLayout/adminBackground/processedVehicle'})
    },
    toPendingFeedback() {
      this.$router.push({path:'/adminLayout/adminBackground/pendingFeedback'})
    },
    toProcessedFeedback() {
      this.$router.push({path:'/adminLayout/adminBackground/processedFeedback'})
    }
  }
}
</script>

<style lang="less" scoped>
  .adminBackground {
    display: flex;
    margin: auto;
    min-width: 1000px;
    flex-wrap: wrap;

    .admin-center {
      display: flex;
      width: 100%;
      justify-content: space-between;
      .admin-left {
        width: 17%;
        height: 100%;
        min-width: 201px;
      }
      .admin-right {
        width: 81%;
        height: 800px;
        background-color: #fff;

      }
    }
  }


</style>